<template>
  <el-menu
    :default-active="active"
    class="el-menu-vertical-demo"
    background-color="#545c64"
    text-color="#fff"
    active-text-color="#ffd04b"
    router
  >
    <el-menu-item
      v-if="userinfo?userinfo.rolltype==nav.roll:userinfo"
      v-for="(nav,i) in navList"
      :index="nav.path"
      :key="i"
    >
      <i :class="nav.icon"></i>
      <span slot="title">{{nav.text}}</span>
    </el-menu-item>
  </el-menu>
</template>

<script>
var navList = [
  {
    path: "/main/stuhome",
    text: "查看成绩",
    icon: "el-icon-document",
    name: "stuhome",
    roll: "1",
  },
  {
    path: "/main/stusubmit",
    text: "提交项目",
    icon: "el-icon-menu",
    name: "stusubmit",
    roll: "1",
  },
  {
    path: "/main/stuproject",
    text: "管理项目",
    icon: "el-icon-setting",
    name: "stuproject",
    roll: "1",
  },
  {
    path: "/main/teacherhome",
    text: "主页",
    icon: "el-icon-location",
    name: "teacherhome",
    roll: "2",
  },
  {
    path: "/main/teacher/school",
    text: "校区管理",
    icon: "el-icon-edit",
    name: "teacherschool",
    roll: "2",
  },
  {
    path: "/main/teacher/xueke",
    text: "学科管理",
    icon: "el-icon-setting",
    name: "teacherxueke",
    roll: "2",
  },

  {
    path: "/main/teacher/banji",
    text: "班级管理",
    icon: "el-icon-share",
    name: "teacherbanji",
    roll: "2",
  },
  {
    path: "/main/teacher/protext",
    text: "项目管理",
    icon: "el-icon-menu",
    name: "teacherprotext",
    roll: "2",
  },
];
export default {
  props: {
    userinfo: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      navList,
      active: "",
    };
  },
  mounted() {
    this.active = this.$route.path;
  },
};
</script>


<style>
.el-menu {
  height: 100%;
}
</style>
